<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
    <meta name="viewport" content="width=device-width, initial-scale=1.0"> 
    <title>销毁管理</title>
    <link rel="stylesheet" href="../css/font-awesome.min.css">
    <link rel="stylesheet" href="../bootstrap-3.3.4/dist/css/bootstrap.min.css">
    <link rel="stylesheet" href="../css/common.css">
    <style type="text/css">
        body{
    background: rgba(0,0,0,0);
    color: #fff;
}
        .content-page2{
            position: absolute;
            left: 42%;
            margin-left: 0px;
       }
       .content-page2 .btn-groups button{
            width: 100px;
            
       }
        .btn-groups{
            margin-left: 0;
        }
    </style>
    
</head>
<body>
<div class="tab-content">

    <div class="col-md-12 tab-pane active" id="destroy1">
        <h2 class="text-center">档案列表</h2>
        <br>
        <form class="form-group">
            <table class="table">
                <tr>
                    <th>档案编号</th>
                    <th>提交人</th>
                    <th>归属部门</th>
                    <th>归属类型</th>
                    <th>申请人</th>
                    <th>预定时间</th>
                    <th>借阅时长</th>
                    <th>勾选销毁条目</th>

                </tr>
                <tr>
                    <td><a href="#destroy2" role="tab" data-toggle="tab">1234567910</a></td>
                    <td>kwondo</td>
                    <td>服务部</td>
                    <td>项目文档</td>
                    <td>坤哥</td>
                    <td>2015-7-31 23:57</td>
                    <td>7天</td>
                    <td><input type="checkbox">销毁</td>

                </tr>
                <tr>
                    <td><a href="#destroy2" role="tab" data-toggle="tab">1234567910</a></td>
                    <td>kwondo</td>
                    <td>服务部</td>
                    <td>项目文档</td>
                    <td>坤哥</td>
                    <td>2015-7-31 23:57</td>
                    <td>7天</td>
                    <td><input type="checkbox">销毁</td>

                </tr>
                <tr>
                    <td><a href="#destroy2" role="tab" data-toggle="tab">1234567910</a></td>
                    <td>kwondo</td>
                    <td>服务部</td>
                    <td>项目文档</td>
                    <td>坤哥</td>
                    <td>2015-7-31 23:57</td>
                    <td>7天</td>
                    <td><input type="checkbox">销毁</td>

                </tr>
                <tr>
                    <td><a href="#destroy2" role="tab" data-toggle="tab">1234567910</a></td>
                    <td>kwondo</td>
                    <td>服务部</td>
                    <td>项目文档</td>
                    <td>坤哥</td>
                    <td>2015-7-31 23:57</td>
                    <td>7天</td>
                    <td><input type="checkbox">销毁</td>

                </tr>
                <tr>
                    <td><a href="#destroy2" role="tab" data-toggle="tab">1234567910</a></td>
                    <td>kwondo</td>
                    <td>服务部</td>
                    <td>项目文档</td>
                    <td>坤哥</td>
                    <td>2015-7-31 23:57</td>
                    <td>7天</td>
                    <td><input type="checkbox">销毁</td>

                </tr>
            </table>
            <div class="button-group pull-right">
                <button class="btn btn-default">上一页</button>
                <span>1/10</span>
                <button class="btn btn-default">下一页</button>
            </div>
        </form>
        
        <div style="clear:both;padding-top:10px;"> 
            <button type="button" class="btn btn-default pull-right">销毁选中档案</button>
        </div>
    </div>
    <div class="tab-pane col-md-12" id="destroy2" ><!-- 档案内容、概述根据数据库生成 -->
        <h2 class="text-center">档案内容</h2>
        <div class=" content-page2">
        <div>档案编号：<span>12345678910</span></div>
        <div>归属用户：<span>Kwondo</span></div>
        <div>
            档案描述：
            <div style="width:400px;height:150px;color:#fff;margin-bottom:10px;background:none;padding:10px;">Hellow World!</div>
        </div>
        <div class="btn-groups">
            <button type="submit" class="btn btn-default" data-target="#mymodal" data-toggle="modal" >销毁</button>
            <button type="button" class="btn btn-default" onclick="location='销毁管理.html'">返回</button>
        </div>
         <div class="modal" id="mymodal" style="color:#000;">
                    <div class="modal-dialog ">
                        <div class="modal-content">
                            <div class="modal-header">
                                <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">&times;</span><span class="sr-only">Close</span></button>
                                <h4 class="modal-title">确定销毁？</h4>
                            </div>
                            <div class="modal-body">
                                <p>档案说明：</p>
                                <textarea type="text" maxlength="200" class="form-control" placeholder="200字以内"></textarea>
                                <p>类型：<span>个人档案</span></p>
                                <p>部门：<span>人事部</span></p>
                                <p>销毁说明：</p>
                                <textarea type="text" maxlength="200" class="form-control" placeholder="200字以内"></textarea>
                            </div>
                            <div class="modal-footer">
                                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
                                <button type="button" class="btn btn-primary">确定</button>
                            </div>
                        </div><!-- /.modal-content -->
                    </div><!-- /.modal-dialog -->
                </div><!-- /.modal -->
        </div>
    </div>
</div>
    <script src="../js/jquery-1.11.3.js"></script>
    <script src="../bootstrap-3.3.4\dist\js\bootstrap.min.js"></script> 
</body>
</html>